<template>
    <ul class="home-G">
        <li v-for="(item,index) in Glist" :key="index" @click="goGlist">
                 <img :src="item.img">
            <p> {{item.msg}}</p>

        </li>
    </ul>
</template>

<script>
export default {
    data(){
        return{
            Glist : [{
                msg: "无敌板鞋",
               img: require("../../../assets/imgs/list1_03.jpg"),
            },{
                msg: "无敌板鞋",
                img: require("../../../assets/imgs/list1_05.jpg"),
            },{
                msg: "无敌板鞋",
               img: require("../../../assets/imgs/list1_07.jpg"),
            },{
                msg: "无敌板鞋",
                img: require("../../../assets/imgs/list1_09.jpg"),
            },{
                msg: "无敌板鞋",
                img: require("../../../assets/imgs/list1_15.jpg"),
            },{
                msg: "无敌板鞋",
              img: require("../../../assets/imgs/list1_16.jpg"),
            },{
                msg: "无敌板鞋",
                 img: require("../../../assets/imgs/list1_17.jpg"),
            },{
                msg: "无敌板鞋",
              img: require("../../../assets/imgs/list1_18.jpg"),
            },{
                msg: "无敌板鞋",
               img: require("../../../assets/imgs/list1_03.jpg"),
            },{
                msg: "无敌板鞋",
                 img: require("../../../assets/imgs/list1_03.jpg"),
            }]
        }
    },
    methods:{
        goGlist(){
            this.$router.push("./Glist")
        }
    }

}
</script>

<style scoped>
.home-G{
    width: 100%;padding: 0 0.14rem;margin-top: 0.08rem;display: flex;flex-wrap: wrap;box-sizing: border-box;justify-content: space-around;
}
.home-G li{
    height: 0.6rem;font-size: 00.1rem;font-weight: bold;width: 19%;
}
.home-G li img{
    width: 0.5rem;height: 0.4rem;margin: auto;display: block;
}
.home-G li p{
    text-align: center;margin-top: 0.04rem;
}
</style>